<template lang="html">
    <div class="finance">
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item><i class="el-icon-tickets"></i> 门店销售额</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="container">
            <!-- <div style="padding-bottom:50px;text-indent:20px;">
                <div style="font-size:20px">
                    销售总金额：<span style="font-size:50px;">{{sumMoney}}</span>元
                    <span style="padding-left:60px"></span>当前页销售金额：<span style="font-size:50px;">{{pageSumMoney}}</span>元
                </div>
            </div> -->
            <el-form :inline="true" class="demo-form-inline" >
                <el-form-item label="门店Id" label-width="80px">
                    <el-input v-model="order_code" placeholder="请输入门店Id" style="width:250px"></el-input>
                </el-form-item>
                <el-form-item label="门店名称" label-width="80px">
                    <el-input v-model="nickName" placeholder="请输入门店名称" style="width:250px"></el-input>
                </el-form-item>    
                <el-form-item>
                    <el-button type="primary" @click="search">查询</el-button>
                </el-form-item>
               <el-form-item>
                    <el-button type="primary" @click="reset">重置</el-button>
                </el-form-item>
            </el-form>
            <!-- <el-table :data="tableData" bfinance style="width: 100%" ref="multipleTable">
                <el-table-column prop="name" label="门店名称" ></el-table-column>
                <el-table-column prop="name" label="门店封面图" width="180">
                    <template slot-scope="scope" >
                        <img :src="scope.row.img" style="width:100px;height:100px;"/>
                        </template>
                </el-table-column>
                <el-table-column prop="nick_name" label="项目到店付金额" width="250" align="center"></el-table-column>
                <el-table-column prop="discount_money" label="项目微信支付金额" width="250" align="center"></el-table-column>
                <el-table-column prop="pay_money" label="销售总金额" width="250" align="center"></el-table-column>
                
            </el-table>
            <div class="pagination">
                <el-pagination @current-change="handleCurrentChange" :page-size="pageSize"  layout="prev, pager, next" :total="totalPages">
                </el-pagination>
            </div> -->
            <!-- 表单 -->
            <el-form ref="form"  label-width="150px" v-show="formFlag">
                <el-form-item label="店铺名称">
                    <span>{{form.name}}</span>
                </el-form-item>
                <el-form-item label="店铺封面图">
                    <img :src="form.img" style="width:300px;height:240px"/>
                </el-form-item>
                <el-form-item label="销售总金额">
                    <span>{{form.totalSales}}</span>
                </el-form-item>
            </el-form>
            <!-- /表单 -->
        </div>
    </div>

  </div>
</div>
</template>

<script>
    export default {
        name: "finance",
        data() {
            return {
                pageSumMoney:0,
                sumMoney:0,
                pageIndex: 1,//当前页码
                pageSize: 10,//每页12条
                totalPages: 1,//默认的总条数
                tableData: [],//表格数据
                delVisible: false, //删除确认提示，默认隐藏
                order_code: '',
                source: '1',
                nickName: '',//订单名称
                financeCode: '',//订单编号
                startDate: '',
                endDate: '',//开始日期
                value: '',
                form:{},
                formFlag:false
            }
        },
        mounted() {
            
        },
        methods: {
            //获取data数据
            getFinanceData() {
                var _this =this;
                const param = {
                    storeId: this.order_code,
                    storeName: this.nickName
                }
                this.$axios
                    .get('/manage/finance/store/sales', {params:param})
                    .then(response => {
                        console.log(response);
                        if (response.data.code == 200) {
                            // _this.totalPages = response.data.data.totalElements;
                            let data = response.data.data;
                            _this.form = data;
                            console.log(_this.form)
                            _this.formFlag = true;
                            // _this.tableData = obj;//赋值 table 列表数据
                            //更新金额  总金额， 当前金额
                            // _this.pageSumMoney = response.data.data.data.pageSumMoney;
                            // _this.sumMoney = response.data.data.data.sumMoney;

                        } else {
                            this.$notify.error({
                                title: '提示',
                                message: response.data.msg
                            });
                            // console.log(response.data.msg)
                        }
                    })
                    .catch(error => {
                        console.log(error);
                    });
            },
            // 分页导航
            handleCurrentChange(val) {
                this.pageIndex = val
                this.getFinanceData()
                // this.cur_page = val;
                //     this.getData();
            },
            //查询
            search() {
                this.getFinanceData();
            },
            reset(){
                this.order_code ="";
                this.nickName ="";
            }
            
        }
    }
</script>

<style lang="stylus" scoped>
     
</style>
